<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <link rel="stylesheet" type="text/css" href="css/login.css">
    <script src="js/vue.js"></script>
    <script src="js/cdn.axios.js"></script>
</head>
<body>
<div id="root">
    <div class="login-container">
        <div class="left-container">
            <div class="title"><span>登录</span></div>
            <div class="input-container">
                <span class="input-icon"><img src="images/账户.png" alt="Logo"></span>
                <input type="text" name="username" placeholder="电话号码" v-model="telephone">
                <span class="input-icon"><img src="images/mima.png" alt="Logo"></span>
                <input type="password" name="password" placeholder="密码" v-model="password">
            </div>
        </div>
        <div class="right-container">
            <div class="regist-container">
                <span @click="register">注册</span>
            </div>
            <div class="action-container">
                <span @click="login">登录</span>
            </div>
        </div>
    </div>
</div>
<script>
    const {createApp} = Vue;
    createApp({
        data() {
            return {
                telephone: "",
                password:"",
            }
        },
        methods:{
            login() {
                const that = this;
                axios({
                    method:"post",
                    url:"/user/login",
                    data:{
                        "phoneNum":this.telephone,
                        "secret": this.password,
                    }
                }).then(function (res) {
                    if (res.data.code===200) {
                        console.log(res.data.contentList);
                        localStorage.setItem('userid', JSON.stringify(res.data.contentList[0].id));
                        localStorage.setItem('nickname', JSON.stringify(res.data.contentList[0].nickName));
                        localStorage.setItem('gender', JSON.stringify(res.data.contentList[0].gender));
                        localStorage.setItem('phoneNum', JSON.stringify(res.data.contentList[0].phoneNum));
                        localStorage.setItem('email', JSON.stringify(res.data.contentList[0].email));
                        localStorage.setItem('address', JSON.stringify(res.data.contentList[0].address));
                        window.location.href = 'index.html';

                    } else {
                        alert("用户名或密码错误");
                    }
                })
            },

            register() {
                window.location.href = 'register.html';
            }

        },

    }).mount('#root')
</script>
</body>
</html>